<template>
<!-- 子组件 -->
  <div class="subtmpl">
      <!-- 利用mint swipe做轮播子组件 -->
        <mt-swipe :auto="4000">
        <mt-swipe-item v-for="(item,index) in imagelist" :key="index" >
                <img class="img" :src="item.img" alt="轮播图">
            </mt-swipe-item>
        </mt-swipe>



  </div>
</template>



<style lang="scss" scoped>
budy{background:#fff }

.img{
  height: 100%;
  width: 100%;
}
 .mint-swipe {
    overflow: hidden;
    position: relative;
    height:  180px;
  }
  .mint-swipe-items-wrap {
    position: relative;
    overflow: hidden;
    height: 100%;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
  .mint-swipe-items-wrap > div {
    position: absolute;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    width: 100%;
    height: 100%;
		display: none;
	 /* background: #ff0; */
  }
  .mint-swipe-items-wrap > div.is-active {
    display: block;
    -webkit-transform: none;
    transform: none;
  }
  .mint-swipe-indicators {
    position: absolute;
    bottom: 10px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .mint-swipe-indicator {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: #000;
    opacity: 0.2;
    margin: 0 3px;
  }
  .mint-swipe-indicator.is-active {
    background: #fff;
	}

</style>

<script>

export default {
 		data(){
 			return{
 					imagelist:[{
						 url:'https://www.baidu.com',
						 img:'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1506082627794&di=5a9cb4a356cd01e2fcc05fdf3ee43c5f&imgtype=0&src=http%3A%2F%2Fimg.sccnn.com%2Fbimg%2F322%2F332.jpg'
				 }, {
					 	 url:'https://www.baidu.com',
						 img:'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1506083486648&di=8ee82edc94d9808fa9a833208afef582&imgtype=0&src=http%3A%2F%2Ffile02.16sucai.com%2Fd%2Ffile%2F2014%2F0526%2F0cc87dc8ef23f1c72b51972a28bd7d38.jpg'
         },
         {
            url:'https://www.baidu.com',
            img:"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1506083525697&di=f46f97b7fa878e1e96a1414e7aeb7663&imgtype=0&src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01961c5583bd0b000000b18ff70c92.jpg"
         }]
 			
 			}
         },
          porps:['imagelist']//从父组件传来的
 		
}
</script>
